<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="">
        <p><label for="">用户名:</label><input type="text" name="user"></p>
        <p><label for="">密&emsp;码:</label><input type="text" name="pwd"></p>
        <p><input type="submit" value="注册"><input type="reset" value="取消"></p>
    </form>
    <a href="#one">one</a>
    <a href="#two">two</a>
    <a href="#three">three</a>
    <button class="get">获取</button>
    <button class="set">设置</button>
</body>
<script>
    // location   window.location
    // location的属性
    // protocol     设置或返回(取值和赋值)协议
    // hostname     设置或返回域名或主机名
    // port         设置或返回端口部分
    
    // host         设置或返回域名和端口
    // origin       设置或返回   协议 域名 和 端口

    // pathName     设置或返回 url的路径部分
    // search       设置或返回 url的参数数据部分
    // hash         设置或返回 hash值(url锚点部分) 
    
    // href         设置或返回(取值和赋值)当前窗口的url地址

    // 方法
    // reload()    刷新页面
    // replace()   用新的文档替换原本的文档(页面跳转)   替换当前的历史记录
    // assign()    用新的文档替换原本的文档(页面跳转)   追加当前url到历史列表中

    console.log(location);

    var getBtn = document.getElementsByClassName("get")[0];
    var setBtn = document.getElementsByClassName("set")[0];

    // 设置
    getBtn.onclick = function(){
        console.log(location.protocol);
        console.log(location.hostname);
        console.log(location.port);
        console.log(location.host);
        console.log(location.origin);
        console.log(location.pathname);
        console.log(location.search);
        console.log(location.hash);
        console.log(location.href);
    }

    setBtn.onclick = function(){
        location.protocol = "https:";
        location.hostname = "127.0.0.1";
        location.hostname = "localhost";
        location.hostname = "192.168.59.124";
        location.port = "3000";

        location.pathname = "/day17/html/01 吸顶效果.html";
        location.search = "?a=1&b=2";
        location.hash = "#two";

        location.href = "https://www.baidu.com?a=1&b=2";  // (当前窗口跳转)

        location.reload();

        location.replace("https://www.baidu.com");
        location.assign("https://www.baidu.com");
    }
</script>
</html>